<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- ul>li*5{文渊$你好} -->
    <ul>
        <li class="c1">文渊1你好</li>
        <li id="i1">文渊2你好</li>
        <li class="c1">文渊3你好</li>
        <li>文渊4你好</li>
        <li class="c1">文渊5你好</li>
    </ul>
    <script>
        //通过document.getELementById来获取
        var i1 = document.getElementById("i1")
        console.log(i1);


        //通过document.getElementsByClassName
        var cc = document.getElementsByClassName("c1")
        for(var i = 0 ; i < cc.length ; i++){
            console.log(cc[i]);
        }

        //
        var lis = document.getElementsByTagName("li")
        for(var i = 0 ; i < lis.length ; i++){
            console.log(lis[i]);
        }
    </script>
</body>
</html>